import React from 'react'
import { Form, Input, Card, Button, Switch, Checkbox, InputNumber } from 'antd'
import { PageHeaderWrapper } from '@ant-design/pro-layout'

const CheckboxGroup = Checkbox.Group
const { TextArea } = Input;
export default () => {
    return (
        <PageHeaderWrapper title={false}>
            <Card>
                <Form
                    labelCol={{ span: 3 }}
                    wrapperCol={{ span: 11 }}
                    initialValues={{ type: [1, 2], is_allow_reg: true }}
                >
                    <Form.Item label="是否允许注册" name="is_allow_reg" help="设置为关闭，则无法注册会员账号" valuePropName="checked">
                        <Switch />
                    </Form.Item>

                    <Form.Item label="注册类型" name="type" help="如果开启邮箱和手机注册，请在消息管理功能中进行邮箱与短信通知配置，游客在注册时通过验证方能注册成功">
                        <CheckboxGroup >
                            <Checkbox value={1}>普通注册</Checkbox>
                            <Checkbox value={2}>手机注册</Checkbox>
                        </CheckboxGroup>
                    </Form.Item>

                    <Form.Item label="用户保留关键字" required help='用户在注册用户名不可使用这些关键字。多个关键字之间以英文","分隔开，如"admin,username"'>
                        <TextArea rows={3} />
                    </Form.Item>
                    <Form.Item label="密码最小长度" required help="新用户注册时密码最小长度，0或不填为不限制">
                        <InputNumber />
                    </Form.Item>

                    <Form.Item label="密码复杂程度" name="type" help="设置密码复杂度">
                        <CheckboxGroup >
                            <Checkbox value={1}>数字</Checkbox>
                            <Checkbox value={2}>小写字母</Checkbox>
                            <Checkbox value={3}>大写字母</Checkbox>
                            <Checkbox value={4}>符号</Checkbox>
                        </CheckboxGroup>
                    </Form.Item>

                    <Form.Item wrapperCol={{ offset: 3 }}>
                        <Button type="primary">保存</Button>
                    </Form.Item>
                </Form>
            </Card>
        </PageHeaderWrapper>
    )
}